<template>
   <el-dialog
        :title="modalTitle"
        :visible="visible"
        width="1000px"
        :close-on-click-modal="false"
        :close-on-press-escape="false"
        destroy-on-close
        append-to-body
        @close="cancelAction"
    >
        <div class="opers flex v-c mb-10">
            <el-form :inline="true" class="filter-blk flex-1">
                <el-form-item label="账号:">
                    <el-input placeholder="请输入账号" style="width:200px" v-model.trim="filterForm.accountname"></el-input>
                </el-form-item>
                <el-form-item label="姓名:">
                    <el-input placeholder="请输入姓名" style="width:200px" v-model.trim="filterForm.name"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="searchAction"><i class="iconfont icon-search"></i> 搜索</el-button>
                    <el-button type="primary" @click="resetAction"><i class="iconfont icon-refresh"></i> 重置</el-button>
                </el-form-item>
            </el-form>
        </div>
        <el-table 
            :data="userList" 
            style="width: 100%"
            v-loading="loading"
            @selection-change="handleSelectionChange"
        >
            <el-table-column type="selection" width="55"></el-table-column>
            <el-table-column prop="accountname" label="账号"></el-table-column>
            <el-table-column prop="name" label="姓名"></el-table-column>
            <el-table-column prop="homeName" label="单位名称"></el-table-column>
            <el-table-column prop="phone" label="手机号码"></el-table-column>
            <el-table-column prop="email" label="邮箱"></el-table-column>
        </el-table>
        <!-- footer -->
        <div slot="footer">
            <el-button type="cancel" @click="cancelAction">取消</el-button>
            <el-button type="primary" :loading="adding" :disabled="multipleSelection.length==0" @click="submitAction">确定指派</el-button>
        </div>
    </el-dialog>
</template>
<script>
export default {
    props: {
        visible: {
            type: Boolean,
            default: false
        },
        activeData: {
            type: Object,
            default () {
                return null
            }
        }
	},
    data () {
        return {
            filterForm: {},
            loading: false,
            userList: [],
            adding: false,
            multipleSelection: []
        }
    },
    computed: {
        modalTitle () {
            return this.activeData ? `${this.activeData.name}-指派` : '任务指派'
        },
    },
    created () {
        this.getUser()
    },
    methods: {
        handleSelectionChange(val) {
            this.multipleSelection = val;
        },
        getUser (page) {
			this.loading = true
            const params = Object.assign({
				page: page,
				limit: this.pageSize,
				homeId: this.$store.state.siteInfos.homeId
			},this.filterForm)
			this.$get('/systemsetup/systemsetup/userList', params).then(res => {
				this.loading = false
                this.userList = res.data
            }, (err) =>{
            	this.loading = false
            	this.$message.error(err.msg)
            })
		},
        searchAction () {
            this.getUser()
        },
        resetAction () {
            this.filterForm.param = ''
        },
        cancelAction() {
            this.$emit('update:visible',false)
        },
        submitAction () {
            if(this.multipleSelection.length==0){
                this.$message.error('请选择用户')
                return
            }
            this.adding = true
            const params = {
                id: this.activeData.id,
                userIds: this.multipleSelection.map(item=>item.id).join(','),
                userNames: this.multipleSelection.map(item=>item.name).join(',')
            }
            this.$post('/check/maintenance/taskAssignment', params).then(res=>{
                this.adding = false
                this.$message.success('保存成功')
                this.$emit('update:visible',false)
                this.$emit('success')
            }, error => {
                this.adding = false
                this.$message.error(error.msg);
            })
        }
    },
}
</script>